<template>
    <div class="wrapper">

        <!-- header部分 -->
        <header>
            <p>在线支付</p>
        </header>

        <!-- 订单信息部分 -->
        <h3>订单信息：</h3>
        <div class="order-info">
            <p>
                万家饺子（软件园E18店）
                <i class="fa fa-caret-down" id="showBtn"></i>
            </p>
            <p>&#165;49</p>
        </div>

        <!-- 订单明细部分 -->
        <ul class="order-detailet" id="detailetBox">
            <li>
                <p>纯肉鲜肉（水饺） x 2</p>
                <p>&#165;15</p>
            </li>
            <li>
                <p>玉米鲜肉（水饺） x 1</p>
                <p>&#165;16</p>
            </li>
            <li>
                <p>配送费</p>
                <p>&#165;3</p>
            </li>
        </ul>

        <!-- 支付方式部分 -->
        <ul class="payment-type">
            <li>
                <img src="../img/alipay.png">
                <i class="fa fa-check-circle"></i>
            </li>
            <li>
                <img src="../img/wechat.png">
            </li>
        </ul>
        <div class="payment-button">
            <button>确认支付</button>
        </div>

        <!-- 底部菜单部分 -->
        <div class="footer">
            <div @click="handleClick(1)"><i class="fa fa-home"></i><p>首页</p></div>
            <div><i class="fa fa-compass"></i><p>发现</p></div>
            <div @click="handleClick(2)"><i class="fa fa-file-text"></i><p>订单</p></div>
            <div @click="handleClick(3)"><i class="fa fa-user-o"></i><p>我的</p></div>
        </div>
    </div>
</template>

<script setup>
import router from "../router/index.js";


function handleClick(Num){
    //路由负责跳转
    if (Num===1)router.push('/Index')
    if(Num===2)router.push('/OrderList')
    if(Num===3)router.push('/Login')
    if(Num===4)router.push('/BusinessNew')

}
</script>

<style scoped>
@import "../../src/css/reset.css";
@import "../../src/css/font-awesome/css/font-awesome.min.css";
@import "../../src/css/payment.css";
@import "../../src/css/normalize.css";
@import "../../src/css/global.css";
@import "../../src/css/ico.css";
@import "../../src/css/index.css";
</style>